<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>文本装饰属性</title>
  <style>
    /* div {
       下划线 
      text-decoration: underline;
       删除线——
      text-decoration: line-through;
    } */

    a {
      /* 取消下划线 */
      text-decoration: none;
    }

    .div1 {
      width: 300px;
      height: 300px;
      border: 1px solid red;

      /* 文本对齐方式 左对齐 中间对齐 右对齐 ——只针对容器中的文字*/
      text-align: center;
    }

    .div2 {
      width: 100px;
      height: 100px;
      border: 1px solid blue;
    }

    /* 设置文本缩进 */
    p {
      /* 首行缩进两个文字 */
      text-indent: 2em;
    }

    /* 设置字体形变 */
    section {
      /* 全部变成大写 */
      /* text-transform: uppercase; */

      /* 首字母大写 */
      /* text-transform: capitalize; */

      /* 全部变成小写 */
      /* text-transform: lowercase; */

      /* 等宽字体 */
      /* text-transform: full-width; */

      /* 文本阴影  （x y 第三参数） 第三——越小越清晰——设置模糊距离*/
      text-shadow: -5px 5px 5px red;
    }
  </style>
</head>

<body>
  <div class="div1">我是一个div
    <div class="div2"></div>
  </div>
  <a href="#">百度一下</a>
  <p>我是一个段落标签我是一个段落标签我是一个段落标签我是一个段落标签我是一个段落标签<br>
    我是一个段落标签我是一个段落标签我是一个段落标签我是一个段落标签我是一个段落标签
  </p>
  <section>hello css</section>

</body>

</html>